<template>
  <div class="app-container" v-loading="loading">
     <div id="searchConditions">
        <el-row :gutter="20">
        	<el-col :span="12">
            	<el-input v-model="t.active_name" placeholder="考试名称"></el-input>
            </el-col>
        </el-row>
	     <br>
        <el-row style="text-align: center;margin-top:20px;">
            <el-col :span="24" size="large">
              <el-button @click="search" type="primary" size="large ">查询</el-button>
            </el-col>
        </el-row>
      </div>
      <div style="padding: 20px;text-align: left">
        <el-button-group>
			    <el-button @click="confirm()" type="primary">设置监考活动无效</el-button>
        </el-button-group>
     </div>
      <el-table :data="examActives.item" v-loading="loading"
          style="width:100%" @selection-change="handleSelectionChange">
          <el-table-column type="selection">
            </el-table-column>
            <el-table-column prop="active_name" align="center" label="考试名称">
            </el-table-column>
            <el-table-column prop="signupStatus" align="center" label="考试活动状态">
              <template slot-scope="scope">
                <el-tag :type="scope.row.signupStatus === '报名未开始' ? 'info' : scope.row.signupStatus === '已报满' ? 'error' : scope.row.signupStatus === '报名已结束' ? 'danger' : 'success' " close-transition>
                  {{scope.row.signupStatus }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="examinationFee" align="center" label="监考费标准">
            </el-table-column>
            <el-table-column prop="personnel_type" align="center" label="考务人员类型">
            </el-table-column>
            <el-table-column prop="signup_rate" align="center" label="报名情况">
            </el-table-column>
            <el-table-column align="center" label="操作">
              <template slot-scope="scope">
                <el-button @click="handleClick(scope.row)" type="text">查看详情</el-button>
              </template>
            </el-table-column>
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="examActives.pageNumber"
            :page-sizes="[20, 30, 50, 100]"
            :page-size="examActives.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="examActives.total">
        </el-pagination>
        <!--监考报名教师详情 -->
        <el-dialog title="监考活动报名详情" :visible.sync="dialogVisible" width="100%">

            <div id="searchConditionsDetail">
              <el-row :gutter="20">
                <el-col :span="6">
                  <el-input v-model="t.name" placeholder="姓名"></el-input>
                </el-col>
                <el-col :span="6">
                  <el-input v-model="t.code" placeholder="工号"></el-input>
                </el-col>
              </el-row>
              <br>
              <el-row :gutter="20">
                <el-col :span="6">
                  <el-select v-model="t.department_code" placeholder="请选择部门">
                      <el-option v-for="option in bmOptions" :key="option.value" :value="option.value" :label="option.label"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="6">
                  <el-select v-model="t.gender" placeholder="请选择性别">
                      <el-option :key="3" value="" label="性别:全部"></el-option>
                      <el-option :key="0" :value="1" label="男"></el-option>
                      <el-option :key="1" :value="2" label="女"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="6">
                  <el-select v-model="t.teacher_type_code" placeholder="请选择教师类型">
                      <el-option :key="3" value="" label="教师类型:全部"></el-option>
                      <el-option :key="0" :value="1" label="校聘"></el-option>
                      <el-option :key="1" :value="2" label="院聘"></el-option>
                      <el-option :key="2" :value="3" label="外校教师"></el-option>
                    </el-select>
                </el-col>
              </el-row>
              <br>
            <el-row style="text-align: center;margin-top:20px;">
              <el-col :span="24" size="large">
                  <el-button @click="searchDetail" type="primary" size="large ">查询</el-button>
              </el-col>
            </el-row>
          </div>
          <div style="padding: 20px;text-align: left">
            <el-button-group>
			        <el-button @click="exportSingup()" type="primary" icon="el-icon-message" :loading="downloadLoading">导出报名信息</el-button>
              <el-button @click="showCancelSignup()" type="primary" icon="el-icon-error">取消监考报名</el-button>
            </el-button-group>
          </div>
          <el-table :data="signupInfoDetail.item" v-loading="loading1"
          style="width:100%" @selection-change="handleDetailSelectionChange">
           <el-table-column type="selection">
            </el-table-column>
            <el-table-column prop="ACTIVE_NAME" align="center" label="考试名称">
            </el-table-column>
            <el-table-column prop="CODE" align="center" label="工号">
            </el-table-column>
            <el-table-column prop="NAME" align="center" label="姓名">
            </el-table-column>
            <el-table-column prop="GENDER" align="center" label="性别">
            </el-table-column>
            <el-table-column prop="AGE" align="center" label="年龄">
            </el-table-column>
            <el-table-column prop="DEPARTMENT_NAME" align="center" label="部门">
            </el-table-column>
            <el-table-column prop="TEACHER_TYPE" align="center" label="教师类型">
            </el-table-column>
            <el-table-column prop="IDCARD" align="center" label="身份证号">
            </el-table-column>
            <el-table-column prop="MOBILE_PHONE" align="center" label="手机号">
            </el-table-column>
            <el-table-column prop="EMAIL" align="center" label="邮箱">
            </el-table-column>
            <el-table-column prop="SIGNUP_STATUS" align="center" label="报名状态">
              <template slot-scope="scope">
                <el-tag :type="scope.row.SIGNUP_STATUS === '1' ? 'success': 'error'" close-transition>
                  {{scope.row.SIGNUP_STATUS === '1' ? '报名成功':'报名取消' }}
                </el-tag>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination
            @size-change="handleSizeChangeDetail"
            @current-change="handleCurrentChangeDetail"
            :current-page="signupInfoDetail.pageNumber"
            :page-sizes="[20, 30, 50, 100]"
            :page-size="signupInfoDetail.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="signupInfoDetail.total">
        </el-pagination>
        </el-dialog>
        <el-dialog title="设置监考活动无效" :visible.sync="confirmed" center>
          <span>您确定要将此监考活动设置为无效状态吗</span>
          <span slot="footer" class="dialog-footer">
            <el-button @click="confirmed = false">取消</el-button>
            <el-button type="primary" @click="execUpdate()">确定</el-button>
          </span>
        </el-dialog>
        <el-dialog title="取消监考报名" :visible.sync="CancelSignupConfirmed" center>
          <span>您确定要取消监考报名吗</span>
          <span slot="footer" class="dialog-footer">
            <el-button @click="CancelSignupConfirmed = false">取消</el-button>
            <el-button type="primary" @click="execCancelSignup()">确定</el-button>
          </span>
        </el-dialog>
  </div>
</template>
<script>
import { republishExaminationActive, myExaminationActive, updateExaminationStatus, getSignupDetail, updateSignupStatus } from '@/api/activePublish'
import { mapGetters } from 'vuex'
import { parseTime } from '@/utils'
import axios from 'axios'
import _ from 'lodash'
export default {
  data() {
    return {
      form: {
        imglist: []
      },
      examActives: {
        total: 0,
        pageNumber: 1,
        pageSize: 20,
        item: []
      },
      items: [],
      signupInfoDetail: {
        total: 0,
        pageNumber: 1,
        pageSize: 20,
        item: []
      },
      t: {
        active_name: '',
        activeId: '',
        name: '',
        code: '',
        department_code: '',
        gender: '',
        teacher_type_code: ''
      },
      imgList: [{ name: 'ExcelTest.xls', src: '/src/icons/Excel.png' }],
      rules: {
        active_name: [{ required: true, message: '请输入监考活动名称', trigger: 'blur' }],
        signup_start_date: [{ required: true, message: '请输入报名开始时间', trigger: 'blur' }],
        signup_end_date: [{ required: true, message: '请输入报名结束时间', trigger: 'blur' }],
        exam_start_date: [{ required: true, message: '请输入考试开始时间', trigger: 'blur' }],
        exam_end_date: [{ required: true, message: '请输入考试结束时间', trigger: 'blur' }],
        numOfPeaple: [{ required: true, message: '请输入需求人数', trigger: 'blur' }],
        examinationFee: [{ required: true, message: '请输入监考费用标准', trigger: 'blur' }],
        personnel_type: [{ required: true, message: '请选择考务人员类型', trigger: 'blur' }],
        canOffCampusSignup: [{ required: true, message: '请确定校外教师能否报名', trigger: 'blur' }]
      },
      loading: false,
      loading1: false,
      downloadLoading: false,
      dialogVisible: false,
      confirmed: false,
      CancelSignupConfirmed: false,
      disabled: true,
      currentPageNumber: 1,
      currentPageNumberDetail: 1,
      multipleSelection: [],
      multipleSelectionIds: '',
      multipleSelectionDetail: [],
      multipleSelectionIdsDetail: '',
      bmOptions: [{ value: '', label: '部门:全部' }, { value: '101', label: '会计学院' },
        { value: '102', label: '金融学院' },
        { value: '104', label: '经济学院' },
        { value: '105', label: '法学院' },
        { value: '106', label: '公共经济与管理学院' },
        { value: '107', label: '人文学院' },
        { value: '108', label: '信息管理与工程学院' },
        { value: '109', label: '外国语学院' },
        { value: '110', label: '统计与管理学院' },
        { value: '111', label: '数学学院' },
        { value: '112', label: '体育教育部' },
        { value: '113', label: '继续教育学院' },
        { value: '115', label: '国际文化交流学院' },
        { value: '123', label: '国际教育学院' },
        { value: '125', label: '马克思主义学院' },
        { value: '126', label: '创业学院' },
        { value: '127', label: '商学院' },
        { value: '211', label: '研究室' },
        { value: '213', label: '国际处' },
        { value: '214', label: '教务处' },
        { value: '215', label: '学生处' },
        { value: '216', label: '研究生院' },
        { value: '217', label: '科研处' },
        { value: '219', label: '信息化办公室' },
        { value: '228', label: '团委' },
        { value: '231', label: '现代服务产业园区办公室' },
        { value: '302', label: '高等研究院' },
        { value: '321', label: '公共政策与治理研究院' },
        { value: '341', label: '财经研究所' },
        { value: '353', label: '高等教育研究所' },
        { value: '358', label: '上海市金融信息技术研究重点实验室' },
        { value: '359', label: '中国公共财政研究院' },
        { value: '361', label: '上海发展研究院' },
        { value: '368', label: '三农研究院' },
        { value: '404', label: '就业指导中心' },
        { value: '409', label: '实验中心' },
        { value: '-1', label: '外校教师' }]
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'roles',
      'userId'
    ])
  },
  mounted: function() {
    this.refetchData()
  },
  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const that = this
          const curTime = new Date()
          if (that.$refs[formName].model.signup_start_date >= that.$refs[formName].model.signup_end_date) {
            that.$message.error('报名开始时间应在报名结束时间之前')
            that.refetchData()
            return
          }
          if (that.$refs[formName].model.exam_start_date >= that.$refs[formName].model.exam_end_date) {
            that.$message.error('考试开始时间应在考试结束时间之前')
            that.refetchData()
            return
          }
          if (that.$refs[formName].model.signup_end_date >= that.$refs[formName].model.exam_start_date) {
            that.$message.error('报名时间应该考试开始时间之前')
            that.refetchData()
            return
          }
          that.loading = true
          const param = {
            'id': that.$refs[formName].model.id,
            'activeName': that.$refs[formName].model.active_name,
            'signupStartTime': parseTime(that.$refs[formName].model.signup_start_date),
            'signupEndTime': parseTime(that.$refs[formName].model.signup_end_date),
            'examStartTime': parseTime(that.$refs[formName].model.exam_start_date),
            'examEndTime': parseTime(that.$refs[formName].model.exam_end_date),
            'createUserId': that.name,
            'personnelTypeName': that.$refs[formName].model.personnel_type,
            'numOfPeaple': that.$refs[formName].model.numOfPeaple,
            'departmentCode': that.$refs[formName].model.department_code,
            'remark': that.$refs[formName].model.remark,
            'canOffCampusSignup': that.$refs[formName].model.canOffCampusSignup,
            'examinationFee': that.$refs[formName].model.examinationFee,
            'status': '1',
            'modifyTime': parseTime(curTime.toString()),
            'filePath': that.arrayToString(that.$refs[formName].model.imglist)
          }
          republishExaminationActive(param.id, param.activeName, param.departmentCode, param.signupStartTime, param.signupEndTime,
            param.examStartTime, param.examEndTime, param.createUserId, param.personnelTypeName, param.numOfPeaple,
            param.examinationFee, param.remark, param.canOffCampusSignup, param.status, param.modifyTime, param.filePath).then(response => {
            // console.log(response)
            if (response.exception) {
              that.loading = false
              that.$message.error(response.exception.message)
              return
            } else if (response.message === '活动已经正式发布,不能更新') {
              that.$message.error('活动已经正式发布，不能更新')
              that.loading = false
              that.disabled = true
            }
            that.loading = false
            that.disabled = true
          }).catch(error => {
            that.loading = false
            console.log(error)
            that.$message.error('发布活动失败，请联系管理员')
          })
          that.refetchData()
        } else {
          console.log('error')
        }
      })
    },
    edit() {
      this.disabled = false
    },
    transferToBoolean: function(val) {
      if (val === 'true') {
        return true
      } else {
        return false
      }
    },
    fileDel(idx) {
      if (this.disabled) {
        this.$message.error('非编辑状态不能删除,请先点击编辑')
        return
      }
      this.form.imglist.splice(idx, 1)
    },
    arrayToString(array) {
      if (array instanceof Array) {
        if (array.length > 0) {
          let files = ''
          for (let i = 0; i < array.length; i++) {
            files += array[i].name + ','
          }
          return (files.substring(files.length - 1) === ',') ? files.substring(0, files.length - 1) : files
        }
      } else {
        return array
      }
    },
    refetchData() {
      this.loading = true
      const param = {
        'pageSize': this.examActives.pageSize,
        'pageNumber': this.examActives.pageNumber,
        'username': this.name,
        'active_name': this.t.active_name
      }
      myExaminationActive(param.pageSize, param.pageNumber, param.username, param.active_name).then(response => {
        if (response.exception) {
          this.loading = false
          this.$message.error(response.exception.message)
          return
        }
        const data = response.result
        this.examActives.total = response.totalRows
        this.examActives.item = []
        for (let i = 0; i < data.length; i++) {
          const imgList = []
          if (data[i]['FILEPATH'] !== null) {
            const fileList = data[i]['FILEPATH'].split(',')
            for (let i = 0; i < fileList.length; i++) {
              const fileExtension = fileList[i].split('.')[1]
              let imgUrl = ''
              if (fileExtension === 'xls' || fileExtension === 'xlsx') {
                imgUrl = './static/icons/Excel.png'
              } else if (fileExtension === 'doc' || fileExtension === 'docx') {
                imgUrl = './static/icons/word.png'
              } else {
                imgUrl = './static/icons/pdf.png'
              }
              imgList.push({ name: fileList[i], src: imgUrl })
            }
          }
          this.examActives.item.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
            signup_start_date: data[i]['SIGNUPSTARTTIME'],
            signup_end_date: data[i]['SIGNUPENDTIME'],
            exam_start_date: data[i]['EXAMSTARTTIME'],
            exam_end_date: data[i]['EXAMENDTIME'],
            publish_time: data[i]['PUBLISHTIME'],
            personnel_type: data[i]['PERSONNELTYPENAME'],
            remark: data[i]['REMARK'],
            department_code: data[i]['DEPARTMENTCODE'],
            numOfPeaple: data[i]['NUMOFPEAPLE'],
            signup_rate: data[i]['SIGNUPRATE'],
            signupStatus: data[i]['SIGNUPSTATUS'],
            examinationFee: data[i]['EXAMINATIONFEE'],
            canOffCampusSignup: this.transferToBoolean(data[i]['CANOFFCAMPUSSIGNUP']),
            imglist: imgList
          })
        }
        this.loading = false
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message.error('获取数据失败...')
      })
    },
    refetchCurrentPage() {
      this.loading = true
      const param = {
        'pageSize': this.examActives.pageSize,
        'pageNumber': this.currentPageNumber,
        'username': this.name,
        'active_name': this.t.active_name
      }
      myExaminationActive(param.pageSize, param.pageNumber, param.username, param.active_name).then(response => {
        if (response.exception) {
          this.loading = false
          this.$message.error(response.exception.message)
          return
        }
        const data = response.result
        this.examActives.total = response.totalRows
        this.examActives.item = []
        for (let i = 0; i < data.length; i++) {
          const imgList = []
          if (data[i]['FILEPATH'] !== null) {
            const fileList = data[i]['FILEPATH'].split(',')
            for (let i = 0; i < fileList.length; i++) {
              const fileExtension = fileList[i].split('.')[1]
              let imgUrl = ''
              if (fileExtension === 'xls' || fileExtension === 'xlsx') {
                imgUrl = './static/icons/Excel.png'
              } else if (fileExtension === 'doc' || fileExtension === 'docx') {
                imgUrl = './static/icons/word.png'
              } else {
                imgUrl = './static/icons/pdf.png'
              }
              imgList.push({ name: fileList[i], src: imgUrl })
            }
          }
          this.examActives.item.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
            signup_start_date: data[i]['SIGNUPSTARTTIME'],
            signup_end_date: data[i]['SIGNUPENDTIME'],
            exam_start_date: data[i]['EXAMSTARTTIME'],
            exam_end_date: data[i]['EXAMENDTIME'],
            publish_time: data[i]['PUBLISHTIME'],
            personnel_type: data[i]['PERSONNELTYPENAME'],
            remark: data[i]['REMARK'],
            department_code: data[i]['DEPARTMENTCODE'],
            numOfPeaple: data[i]['NUMOFPEAPLE'],
            signup_rate: data[i]['SIGNUPRATE'],
            signupStatus: data[i]['SIGNUPSTATUS'],
            examinationFee: data[i]['EXAMINATIONFEE'],
            canOffCampusSignup: this.transferToBoolean(data[i]['CANOFFCAMPUSSIGNUP']),
            imglist: imgList
          })
        }
        this.loading = false
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message.error('获取数据失败...')
      })
    },
    getDownloadUrl(val) {
      return '/api/download/examinationActiveFiles?fileName=' + val
    },
    downloadFile(fileName) {
      const formData = new FormData()
      formData.append('fileName', fileName)
      axios.get('/api/download').then(response => {
      }).catch(message => {
        console.log(message)
        this.$message.error('文件下载失败')
      })
    },
    search() {
      this.loading = true
      console.log(this.t.active_name)
      const param = {
        'pageSize': 20,
        'pageNumber': 1,
        'username': this.name,
        'active_name': this.t.active_name
      }
      myExaminationActive(param.pageSize, param.pageNumber, param.username, param.active_name).then(response => {
        if (response.exception) {
          this.loading = false
          this.$message.error(response.exception.message)
          return
        }
        const data = response.result
        this.examActives.total = response.totalRows
        this.examActives.item = []
        for (let i = 0; i < data.length; i++) {
          const imgList = []
          if (data[i]['FILEPATH'] !== null) {
            const fileList = data[i]['FILEPATH'].split(',')
            for (let i = 0; i < fileList.length; i++) {
              const fileExtension = fileList[i].split('.')[1]
              let imgUrl = ''
              if (fileExtension === 'xls' || fileExtension === 'xlsx') {
                imgUrl = './static/icons/Excel.png'
              } else if (fileExtension === 'doc' || fileExtension === 'docx') {
                imgUrl = './static/icons/word.png'
              } else {
                imgUrl = './static/icons/pdf.png'
              }
              imgList.push({ name: fileList[i], src: imgUrl })
            }
          }
          this.examActives.item.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
            signup_start_date: data[i]['SIGNUPSTARTTIME'],
            signup_end_date: data[i]['SIGNUPENDTIME'],
            exam_start_date: data[i]['EXAMSTARTTIME'],
            exam_end_date: data[i]['EXAMENDTIME'],
            publish_time: data[i]['PUBLISHTIME'],
            personnel_type: data[i]['PERSONNELTYPENAME'],
            remark: data[i]['REMARK'],
            department_code: data[i]['DEPARTMENTCODE'],
            numOfPeaple: data[i]['NUMOFPEAPLE'],
            signup_rate: data[i]['SIGNUPRATE'],
            signupStatus: data[i]['SIGNUPSTATUS'],
            examinationFee: data[i]['EXAMINATIONFEE'],
            canOffCampusSignup: this.transferToBoolean(data[i]['CANOFFCAMPUSSIGNUP']),
            imglist: imgList
          })
        }
        this.loading = false
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message.error('获取数据失败...')
      })
    },
    handleSelectionChange: function(val) {
      const that = this
      that.multipleSelection = []
      let ids = ''
      _.each(val, function(value, key) {
        that.multipleSelection.push(value.id)
        ids += value.id + ','
      })
      that.multipleSelectionIds = (ids.substring(ids.length - 1) === ',') ? ids.substring(0, ids.length - 1) : ids
    },
    updateExaminationActiveStatus() {
      const that = this
      if (that.multipleSelection.length < 1) {
        that.$message({
          message: '未选中任何数据',
          type: 'warning',
          duration: 3000
        })
        return
      }
      const param = {
        'ids': that.multipleSelectionIds
      }
      that.loading = true
      updateExaminationStatus(param.ids).then(response => {
        that.loading = false
        that.refetchCurrentPage()
      }).catch(error => {
        that.loading = false
        console.log(error)
        that.$message.error('更新失败')
      })
    },
    handleClick(row) {
      this.loading1 = true
      this.t.activeId = row.id
      const param = {
        'pageSize': 20,
        'pageNumber': 1,
        'activeId': row.id,
        'code': this.t.code,
        'name': this.t.name,
        'department_code': this.t.department_code,
        'gender': this.t.gender,
        'teacher_type_code': this.t.teacher_type_code
      }
      getSignupDetail(param.pageSize, param.pageNumber, param.activeId, param.code, param.name,
        param.department_code, param.gender, param.teacher_type_code).then(response => {
        this.signupInfoDetail.total = response.totalRows
        this.signupInfoDetail.item = response.result
        this.loading1 = false
      }).catch(error => {
        console.log(error)
        this.loading1 = false
        this.$message.error('获取数据失败')
      })
      this.dialogVisible = true
    },
    handleSizeChange(val) {
      this.loading = true
      const param = {
        'pageSize': val,
        'pageNumber': this.examActives.pageNumber,
        'username': this.name,
        'active_name': this.t.active_name
      }
      myExaminationActive(param.pageSize, param.pageNumber, param.username, param.active_name).then(response => {
        if (response.exception) {
          this.loading = false
          this.$message.error(response.exception.message)
          return
        }
        const data = response.result
        this.examActives.total = response.totalRows
        this.examActives.item = []
        for (let i = 0; i < data.length; i++) {
          const imgList = []
          if (data[i]['FILEPATH'] !== null) {
            const fileList = data[i]['FILEPATH'].split(',')
            for (let i = 0; i < fileList.length; i++) {
              const fileExtension = fileList[i].split('.')[1]
              let imgUrl = ''
              if (fileExtension === 'xls' || fileExtension === 'xlsx') {
                imgUrl = './static/icons/Excel.png'
              } else if (fileExtension === 'doc' || fileExtension === 'docx') {
                imgUrl = './static/icons/word.png'
              } else {
                imgUrl = './static/icons/pdf.png'
              }
              imgList.push({ name: fileList[i], src: imgUrl })
            }
          }
          this.examActives.item.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
            signup_start_date: data[i]['SIGNUPSTARTTIME'],
            signup_end_date: data[i]['SIGNUPENDTIME'],
            exam_start_date: data[i]['EXAMSTARTTIME'],
            exam_end_date: data[i]['EXAMENDTIME'],
            publish_time: data[i]['PUBLISHTIME'],
            personnel_type: data[i]['PERSONNELTYPENAME'],
            remark: data[i]['REMARK'],
            department_code: data[i]['DEPARTMENTCODE'],
            numOfPeaple: data[i]['NUMOFPEAPLE'],
            signup_rate: data[i]['SIGNUPRATE'],
            signupStatus: data[i]['SIGNUPSTATUS'],
            examinationFee: data[i]['EXAMINATIONFEE'],
            canOffCampusSignup: this.transferToBoolean(data[i]['CANOFFCAMPUSSIGNUP']),
            imglist: imgList
          })
        }
        this.loading = false
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message.error('获取数据失败...')
      })
    },
    handleCurrentChange(val) {
      this.loading = true
      this.currentPageNumber = val
      const param = {
        'pageSize': this.examActives.pageSize,
        'pageNumber': val,
        'username': this.name,
        'active_name': this.t.active_name
      }
      myExaminationActive(param.pageSize, param.pageNumber, param.username, param.active_name).then(response => {
        if (response.exception) {
          this.loading = false
          this.$message.error(response.exception.message)
          return
        }
        const data = response.result
        this.examActives.total = response.totalRows
        this.examActives.item = []
        for (let i = 0; i < data.length; i++) {
          const imgList = []
          if (data[i]['FILEPATH'] !== null) {
            const fileList = data[i]['FILEPATH'].split(',')
            for (let i = 0; i < fileList.length; i++) {
              const fileExtension = fileList[i].split('.')[1]
              let imgUrl = ''
              if (fileExtension === 'xls' || fileExtension === 'xlsx') {
                imgUrl = './static/icons/Excel.png'
              } else if (fileExtension === 'doc' || fileExtension === 'docx') {
                imgUrl = './static/icons/word.png'
              } else {
                imgUrl = './static/icons/pdf.png'
              }
              imgList.push({ name: fileList[i], src: imgUrl })
            }
          }
          this.examActives.item.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
            signup_start_date: data[i]['SIGNUPSTARTTIME'],
            signup_end_date: data[i]['SIGNUPENDTIME'],
            exam_start_date: data[i]['EXAMSTARTTIME'],
            exam_end_date: data[i]['EXAMENDTIME'],
            publish_time: data[i]['PUBLISHTIME'],
            personnel_type: data[i]['PERSONNELTYPENAME'],
            remark: data[i]['REMARK'],
            department_code: data[i]['DEPARTMENTCODE'],
            numOfPeaple: data[i]['NUMOFPEAPLE'],
            signup_rate: data[i]['SIGNUPRATE'],
            signupStatus: data[i]['SIGNUPSTATUS'],
            examinationFee: data[i]['EXAMINATIONFEE'],
            canOffCampusSignup: this.transferToBoolean(data[i]['CANOFFCAMPUSSIGNUP']),
            imglist: imgList
          })
        }
        this.loading = false
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message.error('获取数据失败...')
      })
    },
    confirm() {
      this.confirmed = true
    },
    execUpdate() {
      this.confirmed = false
      this.updateExaminationActiveStatus()
    },
    exportSingup() {
      this.downloadLoading = true
      import('@/vendor/Export2Excel').then(excel => {
        const tHeader = ['考试名称', '工号/证件号', '姓名', '性别', '年龄', '部门', '身份证号',
          '教师类型', '手机号', '邮箱', '报名状态(1:成功,0:取消)']
        const filterVal = ['ACTIVE_NAME', 'CODE', 'NAME', 'GENDER', 'AGE', 'DEPARTMENT_NAME', 'IDCARD',
          'TEACHER_TYPE', 'MOBILE_PHONE', 'EMAIL', 'SIGNUP_STATUS']
        const list = this.signupInfoDetail.item
        const data = this.formatJson(filterVal, list)
        excel.export_json_to_excel({
          header: tHeader,
          data,
          filename: 'exportFile',
          autoWidth: this.autoWidth
        })
        this.downloadLoading = false
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => {
        if (j === 'timestamp') {
          return parseTime(v[j])
        } else {
          return v[j]
        }
      }))
    },
    showCancelSignup() {
      if (this.multipleSelectionDetail.length < 1) {
        this.$message({
          message: '未选中任何数据',
          type: 'warning',
          duration: 3000
        })
        return
      }
      this.CancelSignupConfirmed = true
    },
    execCancelSignup() {
      this.cancelSignup()
      this.CancelSignupConfirmed = false
    },
    cancelSignup() {
      const that = this
      if (that.multipleSelectionDetail.length < 1) {
        that.$message({
          message: '未选中任何数据',
          type: 'warning',
          duration: 3000
        })
        return
      }
      const param = {
        'ids': that.multipleSelectionIdsDetail
      }
      that.loading = true
      updateSignupStatus(param.ids).then(response => {
        that.loading = false
        that.refetchCurrentPageDetail()
        that.refetchCurrentPage()
      }).catch(error => {
        that.loading = false
        console.log(error)
        that.$message.error('更新失败')
      })
    },
    searchDetail() {
      this.loading1 = true
      const param = {
        'pageSize': 20,
        'pageNumber': 1,
        'activeId': this.t.activeId,
        'code': this.t.code,
        'name': this.t.name,
        'department_code': this.t.department_code,
        'gender': this.t.gender,
        'teacher_type_code': this.t.teacher_type_code
      }
      getSignupDetail(param.pageSize, param.pageNumber, param.activeId, param.code, param.name,
        param.department_code, param.gender, param.teacher_type_code).then(response => {
        this.signupInfoDetail.total = response.totalRows
        this.signupInfoDetail.item = response.result
        this.loading1 = false
      }).catch(error => {
        console.log(error)
        this.loading1 = false
        this.$message.error('获取数据失败')
      })
    },
    handleDetailSelectionChange(val) {
      const that = this
      that.multipleSelectionDetail = []
      let ids = ''
      _.each(val, function(value, key) {
        that.multipleSelectionDetail.push(value.ID)
        console.log(value.ID)
        ids += value.ID + ','
      })
      that.multipleSelectionIdsDetail = (ids.substring(ids.length - 1) === ',') ? ids.substring(0, ids.length - 1) : ids
    },
    refetchCurrentPageDetail() {
      this.loading1 = true
      const param = {
        'pageSize': this.signupInfoDetail.pageSize,
        'pageNumber': this.currentPageNumberDetail,
        'activeId': this.t.activeId,
        'code': this.t.code,
        'name': this.t.name,
        'department_code': this.t.department_code,
        'gender': this.t.gender,
        'teacher_type_code': this.t.teacher_type_code
      }
      getSignupDetail(param.pageSize, param.pageNumber, param.activeId, param.code, param.name,
        param.department_code, param.gender, param.teacher_type_code).then(response => {
        this.signupInfoDetail.total = response.totalRows
        this.signupInfoDetail.item = response.result
        this.loading1 = false
      }).catch(error => {
        console.log(error)
        this.loading1 = false
        this.$message.error('获取数据失败')
      })
    },
    handleCurrentChangeDetail(val) {
      this.currentPageNumberDetail = val
      this.loading1 = true
      const param = {
        'pageSize': 20,
        'pageNumber': val,
        'activeId': this.t.activeId,
        'code': this.t.code,
        'name': this.t.name,
        'department_code': this.t.department_code,
        'gender': this.t.gender,
        'teacher_type_code': this.t.teacher_type_code
      }
      getSignupDetail(param.pageSize, param.pageNumber, param.activeId, param.code, param.name,
        param.department_code, param.gender, param.teacher_type_code).then(response => {
        this.signupInfoDetail.total = response.totalRows
        this.signupInfoDetail.item = response.result
        this.loading1 = false
      }).catch(error => {
        console.log(error)
        this.loading1 = false
        this.$message.error('获取数据失败')
      })
    },
    handleSizeChangeDetail(val) {
      this.loading1 = true
      const param = {
        'pageSize': val,
        'pageNumber': this.signupInfoDetail.pageNumber,
        'activeId': this.t.activeId,
        'code': this.t.code,
        'name': this.t.name,
        'department_code': this.t.department_code,
        'gender': this.t.gender,
        'teacher_type_code': this.t.teacher_type_code
      }
      getSignupDetail(param.pageSize, param.pageNumber, param.activeId, param.code, param.name,
        param.department_code, param.gender, param.teacher_type_code).then(response => {
        this.signupInfoDetail.total = response.totalRows
        this.signupInfoDetail.item = response.result
        this.loading1 = false
      }).catch(error => {
        console.log(error)
        this.loading1 = false
        this.$message.error('获取数据失败')
      })
    }

  }
}
</script>

<style scoped>
.line{
  text-align: center;
}
.upload_warp_img_div_del {
  position: absolute;
  top: 6px;
  width: 16px;
  right: 4px;
}
.upload_warp_img_div img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}
.upload_warp_img_div {
  position: relative;
  height: 100px;
  width: 120px;
  border: 1px solid #ccc;
  margin: 0px 30px 10px 0px;
  float: left;
  line-height: 100px;
  display: table-cell;
  text-align: center;
  background-color: #eee;
  cursor: pointer;
}
.upload_warp_img_div_top {
  position: absolute;
  top: 0;
  width: 100%;
  height: 30px;
  background-color: rgba(0, 0, 0, 0.4);
  line-height: 30px;
  text-align: left;
  color: #fff;
  font-size: 12px;
  text-indent: 4px;
}
.upload_warp_img_div_text {
  white-space: nowrap;
  width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload_warp_img_div_del {
  position: absolute;
  top: 6px;
  width: 16px;
  right: 4px;
}
.upload_warp_img {
  border-top: 1px solid #D2D2D2;
  padding: 14px 0 0 14px;
  overflow: hidden
}
#searchConditions{
  border:1px solid;
  padding:10px;
}
#searchConditionsDetail{
  border:1px solid;
  padding:10px;
}
table {
  font-size:12px;
  line-height:10px;
}
</style>

